<!--
  Generated template for the CustomIconDemo page.

  See http://ionicframework.com/docs/v2/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>custom-icon-demo</ion-title>
  </ion-navbar>

</ion-header>


<ion-content>
  <div class="my-icon">
    <ion-icon class="iconfont icon-patorl-task" color="primary"></ion-icon>
    <ion-icon class="iconfont icon-patorl-record" color="primary"></ion-icon>
    <ion-icon class="iconfont icon-repair-task" color="primary"></ion-icon>
    <ion-icon class="iconfont icon-repair-record" color="primary"></ion-icon>
    <ion-icon class="iconfont icon-experiment-task" color="secondary"></ion-icon>
    <ion-icon class="iconfont icon-experiment-record" color="secondary"></ion-icon>
    <ion-icon class="iconfont icon-guard-task" color="danger"></ion-icon>
    <ion-icon class="iconfont icon-guard-record" color="danger"></ion-icon>
  </div>
  <ion-list>
    <ion-item>
      试验记录
      <ion-icon class="iconfont icon-experiment-record" color="secondary" item-right></ion-icon>
    </ion-item>
    <ion-item>
      巡检记录
      <ion-icon class="iconfont icon-patorl-record" color="primary" item-right></ion-icon>
    </ion-item>
    <ion-item>
      <ion-icon class="iconfont icon-patorl-task" color="primary" item-left></ion-icon>
      巡检任务
    </ion-item>
    <ion-item>
      <ion-icon class="iconfont icon-experiment-task" color="secondary" item-left></ion-icon>
      试验任务
    </ion-item>
  </ion-list>


  <ion-icon name="zhifubao" color="primary" style="font-size: 32px"></ion-icon>
  <ion-icon name="ios-zhifubao-outline" color="secondary" style="font-size: 64px"></ion-icon>
  <ion-icon name="qq" color="danger" style="font-size: 50px"></ion-icon>
  <ion-icon name="ios-qq-outline" color="primary" style="font-size: 40px"></ion-icon>
  <div padding>
    <button ion-button block (click)="details('http://www.jianshu.com/p/f6488850b6a2')">查看详情</button>
  </div>
</ion-content>
